<template>
    <div class="grid-table-row" :style="rowStyle">
        <slot></slot>
    </div>
</template>

<script lang="ts" setup>
import { inject, computed } from "vue"
import { TABLE_PROVIDE_KEY } from "./index"
const TABLE_CONFIG:any = inject(TABLE_PROVIDE_KEY)
const rowStyle = computed(() => {
    const columns = Array.from(TABLE_CONFIG.value?.columns?.values() ?? [])
    return {
        'grid-template-columns': columns?.map(v => v.width ? v.width+ 'px' : 'auto').join(' ')
    }
})
</script>

<style lang="less" scoped>
.grid-table-row{
    display: grid;
}
</style>